const top = {
    template: `
<div id="nav-bottom">
\t\t<!--顶部-->
\t\t<div class="nav-top">
\t\t\t<div class="top">
\t\t\t\t<div class="py-container">
\t\t\t\t\t<div class="shortcut">
\t\t\t\t\t\t<ul class="fl">
\t\t\t\t\t\t\t<li class="f-item">小鸿商城欢迎您！</li>
\t\t\t\t\t\t\t<li class="f-item" v-if="user == null">请
\t\t\t\t\t\t\t\t<a href="http://www.xiaohong.work/login.html?returnUrl=index.html" target="_blank">登录</a>
\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t<a href="http://www.xiaohong.work/register.html" target="_blank">免费注册</a>
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t<li class="f-item" v-if="user != null" style="color: red" v-text="user.nickName"></li>
\t\t\t\t\t\t</ul>
\t\t\t\t\t\t<div class="fr typelist">
\t\t\t\t\t\t\t<ul class="types">
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t\t<a href="http://www.xiaohong.work/cartItem.html" target="_blank">我的订单</a>
\t\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t\t</li>

\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t\t<a href="http://www.xiaohong.work/cart.html" target="_blank">我的购物车</a>
\t\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t\t我的小鸿商城
\t\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>小鸿商城会员</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>企业采购</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>关注小鸿商城</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t\t<a href="#" target="_blank">合作招商</a>
\t\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>
\t\t\t\t\t\t\t\t\t\t<a href="http://api.xiaohong.work" target="_blank">商家后台</a>
\t\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t\t</li>
\t\t\t\t\t\t\t\t<li class="f-item">
\t\t\t\t\t\t\t\t\t<span>网站导航</span></li>
\t\t\t\t\t\t\t</ul>
\t\t\t\t\t\t</div>

\t\t\t\t\t</div>
\t\t\t\t</div>
\t\t\t</div>

\t\t\t<!--头部-->
\t\t\t<div class="header">
\t\t\t\t<div class="py-container">
\t\t\t\t\t<div class="yui3-g Logo">
\t\t\t\t\t\t<div class="yui3-u Left logoArea">
\t\t\t\t\t\t\t<a class="logo-bd" title="小鸿商城" href="http://www.xiaohong.work" target="_blank"></a>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class="yui3-u Rit searchArea">
\t\t\t\t\t\t\t<div class="search">
\t\t\t\t\t\t\t\t<form action="" class="sui-form form-inline">
<!--<div hidden="hidden">-->
<div hidden="hidden">
    <input >
</div>
\t\t\t\t\t\t\t\t\t<div class="input-append">
\t\t\t\t\t\t\t\t\t\t<input type="text" id="autocomplete" v-model="keywords" @keyup.enter="search" class="input-error input-xxlarge" />
\t\t\t\t\t\t\t\t\t\t<a :href="url">
\t\t\t\t\t\t\t\t\t\t\t<button class="sui-btn btn-xlarge btn-danger" type="button"">搜索</button>
\t\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<!--searchAutoComplete-->
\t\t\t\t\t\t\t\t</form>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t</div>

\t\t\t\t\t</div>

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
    `,
    name: "top",
    data() {
        return {
            user: JSON.parse(window.localStorage.getItem('user')),
            keywords: ''
        }
    },
    created() {

    },
    methods: {
        login(){
            window.location = 'www.xiaohong.work/login.html?returnUrl='+window.location;
        },
        search: function(){
            window.location = "http://search.xiaohong.work/searchWeb/list/"+window.localStorage.getItem("accessToken")+"?keywords="+this.keywords;
        }
    },
    computed: {
        url: function () {
            return "http://search.xiaohong.work/searchWeb/list/"+window.localStorage.getItem("accessToken")+"?keywords="+this.keywords;
            // return "http://search.xiaohong.work/searchWeb/list/?keywords="+this.keywords;
        }
    }
};
export default top;
